<%@ taglib prefix="html" uri="http://struts.apache.org/tags-html"%>
<%@ taglib prefix="bean" uri="http://struts.apache.org/tags-bean"%>
<%@ taglib prefix="logic" uri="http://struts.apache.org/tags-logic"%>
<%@ taglib prefix="core" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="display" uri="http://displaytag.sf.net"%>
<%@ page contentType="text/html;charset=UTF-8" language="java"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="id" lang="id">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script>
		window.addEvent('domready', function(){ 
			new Picker.Date('vista1', {
				pickerClass: 'datepicker_vista'
			});
			new Picker.Date('vista2', {
				pickerClass: 'datepicker_vista'
			});
		});
</script>  
<script type="text/javascript"> 
function confirmFinish(params, txt) { 
	return confirmbox(txt ,
            function(ret) {
                while (ret) { 
                	ret = false;
                	var startDate = document.getElementById('vista1').value;
                	var endDate = document.getElementById('vista2').value;
                	var topic = document.getElementById('areaTopic').value;
                	var message = document.getElementById('lblMessage');
                	var textMs = "Please enter the topic, start date and end date of survey!";
					if(topic == null || topic.trim().length == 0){
						message.innerHTML = textMs;
						break;
                	}
					if(startDate == null || startDate.trim().length == 0){
                		message.innerHTML = textMs;
                		break;
                	} 
					if(endDate == null || endDate.trim().length == 0){
                		message.innerHTML = textMs;
                		break;
                	} 
               		var strTmp1 = startDate.split('/', 10);
               		var startDateInputed = new Date(strTmp1[2],(strTmp1[0] - 1 ),strTmp1[1]);
               		var strTmp2 = endDate.split('/', 10);
               		var endDateInputed = new Date(strTmp2[2],(strTmp2[0] - 1 ),strTmp2[1]);
               		if(endDateInputed <= startDateInputed){
                		message.innerHTML = "Invalid data, end date must be greater than start date!";
                		break;
               		}
               		var strTmp3 = document.getElementById('todayId').value.split('/', 10);
               		var todayDate = new Date(strTmp3[2],(strTmp3[0] - 1 ),strTmp3[1]);
               		if(startDateInputed < todayDate){
               			message.innerHTML = "Invalid data, start date can not be less than today!";
                		break;
               		}
               		var divSurvey = document.getElementById('surveyId');
              		if(divSurvey.innerHTML == null || divSurvey.innerHTML.indexOf('answerDiv_') < 0){
                   		message.innerHTML = 'Please enter at least one valid question!';
                   		break;
              		} 
       				var divQuestion =  divSurvey.getElementsByTagName('textarea');
       				var invalid = true;
       				for(var km = 0; divQuestion != null && km < divQuestion.length; km ++){
       					var idQuestion = divQuestion[km].getAttribute('id');
       					if(idQuestion != null && idQuestion.indexOf('txtQuestion') >= 0){
       						if(divQuestion[km].value != null && divQuestion[km].value.trim() != ''){
       							invalid = false;
       						}
       					}
       				}
       				if(invalid){
       					message.innerHTML = 'Please enter at least one valid question!'; 
       					break;
       				} 
	         		var postForm = document.forms[0];
	               	var ps = params.split("&");  
	               	for (i = 0; ps != null && i < ps.length; i++) {
	               		var tmp = ps[i].split("=");
	               		if(tmp != null && tmp.length == 2){
	                		var param = document.createElement("input");
	                		param.type = "hidden";
	                		param.name = tmp[0];
	                		param.value = encodeURI(tmp[1]);
	                		postForm.appendChild(param);
	               		}
	               	}
	               	postForm.submit();
                }
            }
      );
}
</script>
</head>
<body>
	<html:form action="/surveyUpdate.do">
	<html:hidden property="id" />
	<input type="hidden" name="today" id="todayId" value="<bean:write property="startDateStr" name="surveyUpdate"/>"></input>
	<div class="outerbox">
		<div class="mainHeading">
			<div class=""
				style="width: 300px; height: 32px; background: url(images/formTitleBackground.png) no-repeat top right; font-color: #CC0000;">
				<h2 class="formTitle">SURVEY UPDATE</h2>
			</div>
		</div> 
	</div>
	 <div class="outerbox">
	 	<div style="padding-left: 140px;padding-right: 140px;min-height: 500px;">
		 	<div id="surveyId">
		 		<br/><br/>
 				<label><b>Topic of survey:</b></label> 
 				<html:textarea property="areaTopic" style="width: 730px;height: 30px" styleId="areaTopic"></html:textarea>
 				<br/><label></label>
 				Open Date: <html:text property="startDateStr" styleId="vista1"/>
 				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 				Expiry Date: <html:text property="endDateStr" styleId="vista2"/>
		 		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		 		Sent To: 
	 			<html:select name="surveyUpdate" property="subunitId" style="width:220px;">
						<html:optionsCollection property="listSubunit" label="label" value="value" />
				</html:select>
		 		<br/>
		 		<bean:write filter="false" name="surveyUpdate" property="html"/>
		 	</div>
		 	<br/><br/><br/>
			<input id="btnAddQuestion" type="button" name="btnAddQuestion" value="Add question" onclick="addQuestion(this);"/>
		 	<hr/>
		 	<center>
			 	<html:checkbox property="showToAll">Allow people who have permissions to access this page can update, delete topic or view the result of survey.</html:checkbox><br/>
			 	<logic:equal value="add" name="surveyUpdate" property="method">
			 		<input id="btnFinish" type="button" name="btnSave" value="Finish survey" onclick="return confirmFinish('btnAdd=clicked&act=add','Are you sure you want to finish?');"/>
			 	</logic:equal>
			 	<logic:equal value="edit" name="surveyUpdate" property="method">
			 		<input id="btnFinish" type="button" name="btnUpdate" value="Update survey" onclick="return confirmFinish('btnUpdate=clicked&act=edit','Are you sure you want to update the survey?');"/>
			 	</logic:equal>
			 	<logic:equal value="clone" name="surveyUpdate" property="method">
			 		<input id="btnFinish" type="button" name="btnUpdate" value="Clone survey" onclick="return confirmFinish('clone=true&btnUpdate=clicked&act=edit','Are you sure you want to clone this survey?');"/>
			 	</logic:equal>
			 	<br/><b id="lblMessage" style="color: red"></b>
		 	</center>
		 	<br/><br/><br/>
	 	</div>
	 </div>
	</html:form>
</body>
</html>